import { defineComponent } from "vue";

export default defineComponent({
  name: "LongText",
  props: {
    value: {
      type: String,
      required: true,
    },
    limit: {
      type: Number,
      default: 10,
    },
  },
  setup(props) {
    if (props.value.length <= props.limit) {
      return () => (
        <>
          <span>{props.value}</span>
        </>
      );
    } else {
      const text = props.value.substring(0, props.limit) + "...";
      return () => (
        <>
          <el-tooltip content={props.value} placement="top">
            <span>{text}</span>
          </el-tooltip>
        </>
      );
    }
  },
});
